<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>

<style>
div {
  height: 200px;
  width: 200px;
  position: absolute;
}
</style>

<div id="box1" style="left: 100px; top: 200px; transform: scale(1.5, 0.75)"></div>
<div id="box2" style="left: 400px; top: 200px; transform: rotate(30deg)"></div>
<div id="box3" style="left: 100px; top: 400px; transform: translate(50px, 80px)"></div>
<div id="box4" style="left: 400px; top: 400px; transform: translate(10px, 50px) scale(0.8) rotate(-10deg)"></div>

<script>
test(function() {
  assert_equals(getComputedStyle(box1).webkitTransform, "matrix(1.5, 0, 0, 0.75, 0, 0)");
  assert_equals(getComputedStyle(box2).webkitTransform, "matrix(0.866025, 0.5, -0.5, 0.866025, 0, 0)");
  assert_equals(getComputedStyle(box3).webkitTransform, "matrix(1, 0, 0, 1, 50, 80)");
  assert_equals(getComputedStyle(box4).webkitTransform, "matrix(0.787846, -0.138919, 0.138919, 0.787846, 10, 50)");
}, "Testing getComputedStyle(element).webkitTransform");
</script>
